import React from 'react';
import { Tag, Divider, Popconfirm, Menu, Dropdown, Icon } from 'antd';
import ApiTubro from '@/utils/Engineering/ApiTubro';
import { apiPath, tableOperateExpandList, extraData } from './private.config.data';

const tableInsideOperateRender = ({
  text,
  record,
  index,
  selfTarget,
  _letterPoint,
}: {
  text: any;
  record: any;
  index: number;
  selfTarget: any;
  _letterPoint: any; //父组件指向
}) => (
  <div>
    {record.editable ? (
      <>
        <Tag
          color="#1890ff"
          onClick={e =>
            selfTarget.handleSingleQuickEdit({ record, index, editable: false, submit: true })
          }
        >
          确认
        </Tag>
        <Tag
          onClick={e => selfTarget.handleSingleQuickEdit({ index: index, editable: false, record })}
          style={{ marginRight: 0 }}
        >
          取消
        </Tag>
      </>
    ) : (
      <a onClick={e => selfTarget.handleSingleQuickEdit({ e, editable: true, record })}>编辑</a>
    )}
    <Divider type="vertical" />
    <Popconfirm
      placement="left"
      title={'数据诚可贵，谨慎操作,确定要删除吗？'}
      // icon={<Icon theme='filled' type="exclamation-circle" style={{ color: 'red' }} />}
      onConfirm={e => selfTarget.handleSingleDelete(e, record)}
      okText="确定"
      cancelText="取消"
    >
      <a>删除</a>
    </Popconfirm>

    <Divider type="vertical" />

    <Dropdown
      trigger={['click']}
      overlay={
        <Menu>
          <Menu.Item key="1">
            <div
              onClick={(e: any) => {
                selfTarget.handleSingleCopy(record, index, {
                  __sent_data_diff_cover_field: extraData.__sent_data_diff_cover_field,
                });
              }}
            >
              复制
            </div>
          </Menu.Item>

          <Menu.Item key="2">
            <div onClick={e => selfTarget.handleModalEdit(e, record, index)}>弹窗编辑</div>
          </Menu.Item>

          {tableOperateExpandList &&
            tableOperateExpandList.map((item: any) => (
              <Menu.Item key={item.key}>
                <div onClick={e => selfTarget.handleOperaateJump(e, record, _letterPoint, item)}>
                  {item.aliasOperate}
                </div>
              </Menu.Item>
            ))}
        </Menu>
      }
    >
      <a>
        更多 <Icon type="down" />
      </a>
    </Dropdown>
  </div>
);

export { tableInsideOperateRender };
